<template>
	<view class="content">
		<view class="info" v-for="item in list">
			<view class="title">{{item.types.type_name}}</view>
			<image v-for="(ite,i) in item.file" :src="ite" mode="aspectFill" @click="look(item.file,i)"
				class="img_demo"></image>
		</view>
		<image v-if="list.length<1" class="none" src="../../static/img/img_none.png" mode="widthFix"></image>
	</view>
</template>

<script>
	import {
		jobFile
	} from '@/common/js/index.js'
	export default {
		data() {
			return {
				userId: '',
				list: '',
			}
		},
		onLoad(e) {
			// this.info = JSON.parse(e.info)
			console.log(e);
			this.userId = e.id
			this.query()
		},
		methods: {
			query() {
				jobFile({
					user_id: this.userId
				}).then(res => {
					console.log(res);
					this.list = res.data.list
				})
			},
			look(img, i) {
				var list = img
				// list[0] = img
				uni.previewImage({
					// 预览功能图片也必须是数组的
					urls: list,
					current: i,
					success: function(res) {
						console.log(res);
					},
					fail: function(res) {
						console.log(res);
					},
					complete: function(res) {
						console.log(res);
					},
				})
			},
		},
	}
</script>

<style scoped lang="scss">
	.content {
		/* background: white; */
		position: relative;
		overflow: hidden;
	}

	.info {
		margin: 40rpx 30rpx;
		padding: 40rpx 30rpx 40rpx;
		background-color: white;
		background: #FFFFFF;
		border-radius: 12rpx;
		overflow: hidden;

		image {
			width: 296rpx;
			height: 232rpx;
			background: #F9F9F9;
			border-radius: 12rpx;
			margin: 30rpx 0 0;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			vertical-align: top;
			position: relative;

			&:nth-of-type(even) {
				margin-left: 38rpx;
			}

			image {}

		}
	}

	.none {
		width: 440rpx;
		display: block;
		margin: 240rpx auto 0;
	}

</style>